<template>
  <el-radio-group v-model="currentVal" size="small" fill="#D9EBFF" :disabled="isDisabled">
    <el-radio-button
      v-for="(item, index) in renderData"
      :key="index"
      :label="item.value"
      :disabled="item.disabled"
    >
      {{ item.label }}
    </el-radio-button>
  </el-radio-group>
<!--  @click.native.prevent="clickitemdataType(item.value)"-->
</template>

<!-- :disabled="item.disabled"  add  是否禁用标志, 2023-7-13 -->
<script>
export default {
  name: "SwitchRadio",

  props: {
    value: {},

    isDisabled: {
      type: Boolean,
      default() {
        return false;
      }
    },

    renderData: {
      type: Array,
      required: true,
      default() {
        return []
      }
    }
  },

  computed: {
    currentVal: {
      get() {
        return this.value;
      },
      set(val) {
        this.$emit('input', val);
      }
    }
  },
}
</script>

<style scoped>
::v-deep .el-radio-button__orig-radio:disabled:checked+.el-radio-button__inner {
  /*background-color: #F2F6FC !important;*/
  background-color: #cbcbcb !important;
  /* add yg 2023-5-23 */
  color: white;
}
::v-deep .el-radio-button__orig-radio:checked+.el-radio-button__inner{
  background: #D9EBFF;
  color:  #0A4EAB;
  border: 1px solid #0A4EAB !important;
}
::v-deep .el-radio-button__orig-radio:disabled+.el-radio-button__inner {
  border-color: #DCDEE0 !important;
  box-shadow: none !important;
  background: #F7F8FA;
}

::v-deep .el-radio-button:last-child .el-radio-button__inner,
::v-deep .el-radio-button:first-child .el-radio-button__inner {
  border-radius: 0 !important;
}

::v-deep .el-radio-button__inner {
  border-color: #DCDEE0;
}
::v-deep .el-radio-button__inner:hover {
  color:  #0A4EAB;
}
</style>
